/*
Base
==================================================
Contains global base styles for all pages

@sw-package framework
*/

html {
    // used by backdrop util to override body scroll behaviour
    &.no-scroll {
        position: relative;
        overflow: hidden;
    }

    /* stylelint-disable selector-class-pattern -- allow BEM here as it is a generated class name from the administration
     * sw-text-editor component adds a column selector to configure the width of table columns
     * this must no be shown in the storefront as it breaks table layouts
     */

    .sw-text-editor-table {
        .sw-text-editor-table__col {
            border: 1px solid $black;
            padding: 8px;
            text-align: left;
        }

        .sw-text-editor-table__col-selector {
            display: none;
        }
    }

    .sw-text-editor-table__head {
        td {
            background: $gray-200;
        }
    }
    /* stylelint-enable selector-class-pattern */
}

// used by viewport detection helper to determine the current viewport
:root {
    @include media-breakpoint-only(xs) {
        --sw-current-breakpoint: 'xs';
    }
    @include media-breakpoint-only(sm) {
        --sw-current-breakpoint: 'sm';
    }
    @include media-breakpoint-only(md) {
        --sw-current-breakpoint: 'md';
    }
    @include media-breakpoint-only(lg) {
        --sw-current-breakpoint: 'lg';
    }
    @include media-breakpoint-only(xl) {
        --sw-current-breakpoint: 'xl';
    }
    @include media-breakpoint-only(xxl) {
        --sw-current-breakpoint: 'xxl';
    }
}
